<html>
<head>
    <title>ReDriver</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>

<div class="container">
    <div class="header clearfix">
        <h3 class="text-muted">ReDriver</h3>
    </div>

    <div class="jumbotron">
        <h1>ReDriver</h1>
        <p class="lead">Redriver可通过远程对文件进行编辑</p>
        <p><a class="btn btn-lg btn-success" href="#" id="start" role="button">开始</a></p>
    </div>

    <div class="row marketing">
        <div class="col-lg-6">
            <h4>快捷</h4>
            <p>无需登录ssh即可通过浏览器远程编辑项目文件</p>

            <h4>轻量</h4>
            <p>大小不超过10Kb</p>

            <h4>安全</h4>
            <p>完善的权限机制</p>
        </div>
    </div>

    <footer class="footer">
        <p><a href="http://redriver.originalintention.wang">官网:http://redriver.originalintention.wang</a></p>
    </footer>
</div>
<div id="box" style="width: 820px;height: 600px;display: none">
    <ul class="list-group">
        <li type="button" class="list-group-item">
            <button class="btn btn-danger">删除</button>
        </li>
    </ul>
</div>

<textarea id="textarea" style="width: 800px; height: 600px;display: none"></textarea>

</body>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
<script src="https://cdn.bootcss.com/layer/3.0.1/layer.js"></script>
<script>
    var url = 'http://redriver.local.com/reDriver/Service.php';
    $('#start').click(function () {
        layer.prompt({title:'请输入密码', formType:1},function (pass,index) {
            $.post(url,{pass:pass},function (data) {
                eval("var data = " + data);
                if (data.status == 1) {
                    layer.close(index);
                    layer.msg(data.msg);
                    $.post(url,{getData:1},function (res) {
                      eval("var res = " + res);
                      makeDom(res.data);
                      open();
                    })
                } else {
                    layer.msg(data.msg);
                }
            })
        })
    });

    /**
     * 生成dom
     * @param data
     */
    function makeDom(data) {
        var dom = '',href = '',onclick = '';
        for (var i = 0; i < data.length; i++) {
            if (data[i].name == '.') continue;
            if (data[i].name == '..') data[i].name = '上级目录';
            var onclickDel = "del('" + data[i].path + "',this," + data[i].type + ")";
            var onclickShow = "show('" + data[i].path + "',this)";
            var editDisabled = "";
            var delDisabled = "";
                if (data[i].type == 1) {
                    editDisabled = "disabled";
                    delDisabled = "disabled";
                }



            dom += '<li type="button" class="list-group-item">'
                + '<button class="btn btn-danger" ' + delDisabled + ' style="margin-right: 10px;" onclick="' + onclickDel + '">删除</button>'
                + '<button  class="btn btn-success" ' + editDisabled + ' style="margin-right: 10px;" onclick="' + onclickShow + '">编辑</button>';
            if (data[i].type == 1) {
                href = "javascript:into('" + data[i].path + "')";
                dom += '<a ' + 'href="' + href + '">' + data[i].name + '</a></li>';
            } else {
                dom += data[i].name + '</li>';
            }
        }
        $('#box').find('ul').empty().append(dom);
    }

    /**
     * 打开弹窗
     */
    function open() {
        layer.open({
            type : 1,
            shade : true,
            area : ['820px', '600px'],
            shadeClose : false,
            content : $('#box')
        });
    }

    /**
     * 进入文件夹
     * @param path
     */
    function into(path) {
        $.post(url, {into:path}, function (data) {
            eval("var data = " + data);
            makeDom(data.data);
        });
    }

    /**
     * 删除
     * @param path
     * @param type
     */
    function del(path, obj, type) {
	layer.confirm('确认删除吗，此操作将不可恢复',function()
        {
            $.post(url, {delP:path, delT:type}, function (data) {
                eval("var data = " + data);
                if (data.status == 1) {
                    layer.msg(data.msg);
                    $(obj).parent().remove();
                } else {
                    layer.msg(data.msg);
                }
            })
        })

    }

    /**
     * 显示内容
     * @param path
     * @param obj
     */
    function show(path, obj) {
        $.post(url, {editS:path}, function (data) {
            eval("var data = " + data);
            $("#textarea").empty().val(data.data);
            layer.open({
                title:path,
                type:1,
                shade : true,
                area : ['800px', '600px'],
                shadeClose : false,
                content : $('#textarea'),
                cancel:function () {
                    layer.confirm('是否保存？', function () {
                        save(path, $('#textarea').val());
                    })
                }
            })
        })
    }

    /**
     * 编辑保存
     * @param path
     * @param val
     */
    function save(path, val) {
        $.post(url, {save:path, content:val}, function (data) {
            eval("var data = " + data);
            layer.msg(data.msg);
        })
    }



</script>
</html>

